<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>AdminLTE 3 | Registration Page</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <!-- Font Awesome -->
  <link rel="stylesheet" href="./plugins/fontawesome-free/css/all.min.css">
  <!-- Ionicons -->
  <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
  <!-- icheck bootstrap -->
  <link rel="stylesheet" href="./plugins/icheck-bootstrap/icheck-bootstrap.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="./dist/css/adminlte.min.css">
  <!-- Google Font: Source Sans Pro -->
  <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">
</head>
<body class="hold-transition register-page">
<div class="register-box">

  <div class="card">
    <div class="card-body register-card-body">
      <p class="login-box-msg">注册</p>

      <form action="../../index.html" method="post">
        <div class="input-group mb-3">
          <input type="email" id="email" class="form-control" placeholder="电子邮件">
          <div class="input-group-append">
            <div class="input-group-text">
              <span class="fas fa-envelope"></span>
            </div>
          </div>
        </div>
        <div class="input-group mb-3">
          <input type="password" id="password" class="form-control" placeholder="密码">
          <div class="input-group-append">
            <div class="input-group-text">
              <span class="fas fa-lock"></span>
            </div>
          </div>
        </div>
        <div class="input-group mb-3">
          <input type="password" id="re_password" class="form-control" placeholder="再输一次密码">
          <div class="input-group-append">
            <div class="input-group-text">
              <span class="fas fa-lock"></span>
            </div>
          </div>
        </div>
		<div class="input-group mb-3">
          <input type="password" id="auth_code" class="form-control" placeholder="验证码">
          <div class="input-group-append">
            <input type="button" value = "获取验证码" class="btn btn-primary btn-block" onclick="getAuthCode()"/>        
          </div>
        </div>
        <div class="row">
          <div class="col-8">
        
          </div>
          <!-- /.col -->
          <div class="col-4">
            <input type="button" value="注册" onclick="register()" class="btn btn-primary btn-block"/>
          </div>
          <!-- /.col -->
        </div>
      </form>

      

      
    </div>
    <!-- /.form-box -->
  </div><!-- /.card -->
</div>
<!-- /.register-box -->

<!-- jQuery -->
<script src="./plugins/jquery/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script src="./plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- AdminLTE App -->
<script src="./dist/js/adminlte.min.js"></script>
<script type="text/javascript">
var registered = null;

function getAuthCode() {
	if (registered != null && ((new Date()).getTime() - registered) < 60000) {
		alert("一分钟内不容许重复获取");
		return;
	}
	var email =  $('#email').val();
	console.log('email: ' + email);
	if (typeof email == 'undefined' || email == null || email == '') {
		alert('email输入为空');
		return;
	}
	var url = '/api/code/create/' + email;
	$.get(url, function(result){
		if (result != true) {
			alert("验证码发送失败")
		} else {
			alert("验证码已发送到邮箱")
		}
	});
	registered = (new Date()).getTime();
}

function register() {
	//判断入参
	var email =  $('#email').val();
	console.log('email: ' + email);
	var password = $('#password').val();
	console.log('password: ' + password);
	var re_password = $('#re_password').val();
	console.log('re_password: ' + re_password);
	var auth_code = $('#auth_code').val();
	console.log('auth_code: ' + auth_code);
	if (typeof email == 'undefined' || email == null || email == '') {
		alert('email输入为空');
		return;
	}
	if (typeof password == 'undefined' || password == null || password == '') {
		alert('password输入为空');
		return;
	}
	if (typeof re_password == 'undefined' || re_password == null || re_password == '') {
		alert('re_password输入为空');
		return;
	}
	if (password.trim() != re_password.trim()) {
		alert('两次输入的密码不一致！');
		return;
	}
	if (typeof auth_code == 'undefined' || auth_code == null || auth_code == '') {
		alert('auth_code输入为空');
		return;
	}
	//判断email是否注册过
	var url = '/api/user/isRegistered/' + email;
	var registed = false;
	$.get(url, function(result){
		if (result == true) {
			registed = true;
			alert("该email已经注册过");		
		}
	});
	if (registed == true) {
		return;
	}
	//判断验证码
	var valid_success = true;
	url = '/api/code/validate/' + email + '/' + auth_code;
	$.get(url, function(result){
		console.log(result);
		switch(result) {
			case 0:
				console.log('验证码验证成功');
				break;
			case 1:
				alert("验证码错误");
				valid_success = false;
				break;
			case 2:
				alert("验证码超时");
				valid_success = false;
				break;
			default:
				break;
		}
	});
	if (valid_success == false) {
		return;
	}
	//实际注册
	url = '/api/user/register/' + email + '/' + password + '/' + auth_code;
	$.get(url, function(result){
		if (result = true) {
			window.location.replace("/static/index.html")
		} else {
			alert("注册失败")
		}
	});
}


$(document).ready(function(){
    $.ajaxSettings.async = false;
 })
</script>
</body>
</html>
